<template>
   <main class="main">
     <div>
        <v-SurpriseHeader/>
     </div>
    
     <v-SurpriseList :n="gundong"/>
   </main>
</template>

<script>
import SurpriseHeader from  '../components/Surprise/SurpriseHeader.vue';
import SurpriseList from  '../components/Surprise/SurpriseList.vue';
export default {
  name: "Surprise",
  components:{
    'v-SurpriseHeader':SurpriseHeader,
    'v-SurpriseList':SurpriseList
  },
  mounted(){
     let scroll=document.getElementsByClassName("main")[0];
     //监听滚动
      scroll.addEventListener('scroll',this.hanscroll,true);

  
  },
  data:()=>({
    gundong:true
  }),
  methods:{
    //滚动函数
   hanscroll(){
            let scroll=document.getElementsByClassName('main')[0];
            
            let height=document.getElementsByClassName('scroll')[0].offsetHeight;
           // console.log(scroll.scrollTop,height);
            if(scroll.scrollTop>= height){
                this.gundong=false
            }
            if(scroll.scrollTop <= 0){
              this.gundong=true;
            }
        }
  }
}
</script>

<style scoped>
 .main{
   width: 100vw;
   height: 100vh;
   overflow-y:scroll ;
 }
 .main::-webkit-scrollbar{
   display: none;
 }
</style>